import { useSceneStore } from '@/store/scene';
import { retFilePath } from '@/utils';
import { destroyLayer, roadEffectClickCallback } from '@/service';
import { generateListLayerName } from '@/service/layer';

export const addPathEffect = (selEffect: any, exitFn: any) => {
  const sceneStore = useSceneStore();

  const roadPreSettingForm = ref({
    imageUrl: '',
    lineColor: '#4dc9ff',
    lineWidth: 20,
    duration: 1,
    height: 10,
  });

  type AddPathState = 'START' | 'ADD_CONTROL_POINT' | 'NONE';
  const addPathState = ref<AddPathState>('NONE');
  const onAddRoadEffect = ref(false);

  // 路径添加特效
  function addPath() {
    // roadPreSettingForm.value.imageUrl = retFilePath(selEffect.value!.quoteUrl);
    // onAddRoadEffect.value = true;
    const { cimInstance } = window;
    // const { imageUrl, lineColor, lineWidth, duration } = roadPreSettingForm.value;

    const config = {
      name: '路径特效' + Math.random().toString().split('.')[1],
      imageUrl: retFilePath(selEffect.value!.quoteUrl),
      color: '#4dc9ff',
      width: 10,
      speed: 1,
      clampToGround: true,
      tilingX: 5,
    };
    if (['箭头1', '箭头2'].includes(selEffect.value!.effectName)) {
      // config.speed = 0.02;
    } else if (['流线'].includes(selEffect.value!.effectName)) {
      // config.speed = 0.01;
    }
    cimInstance.api.drawPathline(config, (e: any) => {
      const layerParam: any = {
        code: Math.random().toString().split('.')[1],
        show: true,
        json: config,
        name: generateListLayerName('road'),
        layerName: config.name,
        desc: '',
        type: 'road',
      };
      sceneStore.layerList.unshift(layerParam);
      setTimeout(() => {
        roadEffectClickCallback({
          code: 'effect',
          clickObject: {
            id: config.name,
          },
        });
      }, 0);
      exitFn();
    });
  }

  function stopRoadPath() {
    const { cimInstance } = window;
    cimInstance.api.cancelDraw();
    onAddRoadEffect.value = false;
    addPathState.value = 'NONE';
  }

  return {
    addPath,
    addPathState,
    stopRoadPath,
    roadPreSettingForm,
    onAddRoadEffect,
  };
};
